
<template>
  <div class="introduction">
    <div class="btbox btboxbg flexb fontz" style="padding: 0 14px;">
      {{$t('footer.causeDescription')}}
    </div>
    <div class="introductionCont">
      <p :style="$store.state.app.language === 'en' ? 'margin-bottom: 10px; line-height: 20px;' : ''">{{ $t('cpuNet.descriptionTip1') }}</p>
      <p  :style="$store.state.app.language === 'en' ? 'line-height: 20px;' : ''">{{ $t('cpuNet.descriptionTip2') }}</p>
    </div>
  </div>
</template>

<script>
export default {
  name: 'introduction', // 介绍说明
  data() {
    return {
    }
  },
  components: {},
  props: {},
  watch: {},
  computed: {},
  created() {},
  mounted() {},
  beforeDestroy() {},
  methods: {},
}
</script>
<style lang="scss" scoped>
@import "@/assets/css/variables.scss";
.introduction{
  font-size: 14px;

  .btbox {
    height: 42px;
    padding: 0 11px;
  }

  .btboxbg {
    background: $-topcolorf7;
  }

  .introductionCont {
    color: #333;
    padding: 15px;

    p {
      line-height: 24px;
    }

    p:nth-child(1) {
      margin-bottom: 20px;
    }
  }
}
.theme-1B1D27 {
  .introductionCont {
    color: #7b8db9 !important;
  }

  .btboxbg {
    background: rgba(0, 0, 0, 0.2);
    color: $-main-color;
  }
}
</style>

